/**
 * Created by zhaojing on 2017/10/25.
 */
import tpl from './tpl.html';

import {REG_EN_NAME} from '../../../../../../grsc-base/common/constants';
import {REG_PASSPORT} from '../../../../../common/contants'

import lib from '../../../../../common/lib'
import service from '../../service';
import Help from '../../../../../../grsc-base/component/Help.vue';
import Validator from '../../../../../../grsc-base/component/Validator/main';
import Loading from '../../../../../../grsc-base/component/Loading.vue';
import Nationality from '../../../../../component/Nationality.vue';
import DatePickerNew from '../../../../../../grsc-base/component/DatePicker/vue-datepicker-es6.vue';
import fileUpload from '../../../../../../grsc-base/component/Upload/Fileupload.vue';
import Unsupport from './../unsupportedCountries/main'

export default {
    name: 'identityVerification',
    template: tpl,
    components: {
        Validator,
        Loading,
        Help,
        Nationality,
        DatePickerNew,
        fileUpload,
        Unsupport
    },
    data() {
        let dateOption = {
            type: 'day',
            week: [
                this.$t('common.Mo'),
                this.$t('common.Tu'),
                this.$t('common.We'),
                this.$t('common.Th'),
                this.$t('common.Fr'),
                this.$t('common.Sa'),
                this.$t('common.Su')
            ],
            month: [
                this.$t('common.January'),
                this.$t('common.February'),
                this.$t('common.March'),
                this.$t('common.April'),
                this.$t('common.May'),
                this.$t('common.June'),
                this.$t('common.July'),
                this.$t('common.August'),
                this.$t('common.September'),
                this.$t('common.October'),
                this.$t('common.November'),
                this.$t('common.December')
            ],
            format: 'YYYY-MM-DD',
            buttons:{
                cancel:this.$t('common.cancel')
            }
        };
        let expiredOption = $.extend({}, dateOption, {
            dateOption,
            placeholder: this.$t('certification.verify.identity.expirePlace')
        });

        let birthOption = $.extend({}, dateOption, {
            dateOption,
            placeholder: this.$t('certification.birthshort'),
        });

        return {
            lib,
            isLoading: false,
            isRequesting: false,
            isUnsupport:false,
            cardPhotoTip:false,
            cardPhoto1Tip:false,
            cardHandholdTip: false,

            cardPhotoSrcOri:'../img/passport1.jpg',
            cardPhoto1SrcOri:'../img/id2.png',
            cardHandholdSrcOri:'../img/passport2.jpg',

            cardPhotoSrc:'../img/id1.png',
            cardPhoto1Src:'../img/id2.png',
            cardHandholdSrc:'../img/passport2.jpg',

            form: {
                firstName:'',
                middleName:'',
                lastName:'',
                gender:'MALE',
                birthday:'',
                countryId: '',
                country: '',
                cardType: 'ID_CARD',
                cardNo: '',
                expiredDate: '',
                cardPhoto:[],
                cardPhoto1:[],
                cardHandhold: [],
                cardTranslate: [],
                agree: false
            },
            rules: {
                firstName: {
                    required: true,
                    requiredTip: this.$t('certification.fNameTip'),
                    // pattern: (this.$i18n.locale==='hk' || this.$i18n.locale==='cn')?/^[\u4e00-\u9fa5-a-zA-Z]+$/:REG_EN_NAME,
                    // patternTip: this.$i18n.locale==='hk'?'名填寫錯誤':this.$t('certification.fNamePatternTip')
                },
                middleName: {
                    // pattern: (this.$i18n.locale==='hk' || this.$i18n.locale==='cn')?/^[\u4e00-\u9fa5-a-zA-Z]+$/:REG_EN_NAME,
                    // patternTip: (this.$i18n.locale==='hk' || this.$i18n.locale==='cn')?'中名填寫錯誤':this.$t('certification.fNamePatternTip')
                },
                lastName: {
                    required: true,
                    requiredTip: this.$t('certification.lNameTip'),
                    // pattern: (this.$i18n.locale==='hk' || this.$i18n.locale==='cn')?/^[\u4e00-\u9fa5-a-zA-Z]+$/:REG_EN_NAME,
                    // patternTip: (this.$i18n.locale==='hk' || this.$i18n.locale==='cn')?'姓填寫錯誤':this.$t('certification.fNamePatternTip')
                },
                birthday:{
                    required:true,
                    requiredTip:this.$t('certification.birthChooseTip')
                },
                gender:{
                    required: true,
                    requiredTip: this.$t('certification.genderChooseTip')
                },
                countryId:{
                    required: true,
                    requiredTip: this.$t('certification.nationChooseTip')
                },
                cardNo: {
                    required: true,
                    requiredTip: this.$t('certification.verify.identity.docTip'),
                    minlength: 3,
                    minlengthTip: this.$t('certification.verify.identity.docLenTip'),
                    maxlength: 50,
                    maxlengthTip: this.$t('certification.verify.identity.docLenTip'),
                    pattern: REG_PASSPORT,
                    patternTip: this.$t('certification.verify.identity.errDocTip')
                },
                expiredDate: {
                    required: true,
                    requiredTip:this.$t('certification.verify.identity.expireTip')
                },

            },

            expiredOption: expiredOption,
            birthOption: birthOption,
            expiredLimit : [{
                    type: 'fromto',
                    from: (new Date),
                    to:(new Date()).setFullYear((new Date()).getFullYear()+20)}],
            birthLimit: [{
                    type: 'fromto',
                    to:(new Date()).setFullYear((new Date()).getFullYear()-18)}]
        }
    },

    created() {

    },

    watch:{
        'form.cardType'(newVal){
            if(newVal === 'ID_CARD'){
                if(this.form.cardPhoto.length === 0){
                    this.cardPhotoSrc = '../img/id1.png';
                }
                this.cardPhotoSrcOri = '../img/id1.png';

                if(this.form.cardHandhold.length === 0){
                    this.cardHandholdSrc = '../img/id3.png';
                }
                this.cardHandholdSrcOri = '../img/id3.png';

                this.rules.cardNo.minlength = 18;
                this.rules.cardNo.maxlength = 18;
                this.rules.cardNo.minlengthTip = this.$t('certification.verify.identity.idcardtip');
                this.rules.cardNo.maxlengthTip = this.$t('certification.verify.identity.idcardtip');


            }else{
                if(this.form.cardPhoto.length === 0){
                    this.cardPhotoSrc = '../img/passport1.jpg';
                }
                this.cardPhotoSrcOri = '../img/passport1.jpg';

                if(this.form.cardHandhold.length === 0){
                    this.cardHandholdSrc = '../img/passport2.jpg';
                }
                this.cardHandholdSrcOri = '../img/passport2.jpg';

                this.rules.cardNo.minlength = 3;
                this.rules.cardNo.maxlength = 50;
                this.rules.cardNo.minlengthTip = this.$t('certification.verify.identity.docLenTip');
                this.rules.cardNo.maxlengthTip = this.$t('certification.verify.identity.docLenTip');
            }
        }
    },
    methods: {

        goBack(){
            this.init();
            this.currPage = 'basic';

        },

        changeAgree($event) {
            if ($event.target.checked === true) {
                this.form.agree = true;
            } else {
                this.form.agree =  false;
            }
        },

        checkPhoto(){
            let photoFlag = true;
            if (this.form.cardPhoto.length < 1) {
                this.cardPhotoTip = true;
                photoFlag = false;
            }
            if (this.form.cardType === 'ID_CARD' && this.form.cardPhoto1.length < 1) {
                this.cardPhoto1Tip = true;
                photoFlag = false;
            }
            if (this.form.cardHandhold.length === 0) {
                this.cardHandholdTip = true;
                photoFlag = false;
            }

            return photoFlag;
        },

        submit(){
            if (this.rules.$checkAll() === false) {
                this.checkPhoto();
                return;
            } else {
                if (!this.checkPhoto()) {
                    return;
                }
            }

            let cardPhoto = this.form.cardPhoto.concat(this.form.cardPhoto1);

            this.isRequesting = true;
            let param = {
                userBasicInfoDto:{
                    firstName: this.form.firstName,
                    middleName:this.form.middleName,
                    lastName:this.form.lastName,
                    gender:this.form.gender,
                    birthday:this.form.birthday,
                    countryId:this.form.countryId,
                    country:this.form.country
                },
                identificationDto:{
                    countryId:this.form.countryId,
                    country:this.form.country,
                    cardType: this.form.cardType,
                    cardNo: this.form.cardNo,
                    expiredDate: this.form.expiredDate,
                    cardPhoto: cardPhoto,
                    cardHandhold: this.form.cardHandhold,
                    cardTranslate: this.form.cardTranslate
                }
            };
            service.checkId({idNum:this.form.cardNo}).done((rep)=>{
                if(rep.code == window.CODE.SUCCESS){
                    service.level1Auth(param).done((rep) => {
                        if (rep.code === window.CODE.SUCCESS) {
                            window.success(this.$t('common.success'), () => {
                                this.$emit('goBack');
                            });
                        }else if(rep.code === window.CODE.AUTH_RESUBMIT.CODE){
                            window.error(window.CODE.AUTH_RESUBMIT[this.$i18n.locale])
                        } else {
                            window.error(rep.msg);
                        }
                    }).always(() => {
                        this.isRequesting = false;
                    });
                }else{
                    this.isRequesting = false;
                    window.error(rep.msg)
                }
            }).fail((rep)=>{
                this.isRequesting = false;
                window.error(rep.msg)
            })
        },

        changeCountry(currCountry,country){
            this.form.countryId = currCountry;
            this.form.country = country;
            this.rules.countryId.$setRight(``);
        },
        changeBirthDay(currDay){
            this.form.birthday = currDay;
            this.rules.birthday.$setRight(``);
        },
        changeExpiredDay(currDay){
            this.form.expiredDate = currDay;
            this.rules.expiredDate.$setRight('');
        },

        deleteFile(fileList, listName){
            this.form[listName]=fileList;
            this[listName+'Src'] = this[listName+'SrcOri'];
        },

        onFileClick(listName){
            this[listName+'Tip'] = false;
        },

        onFileUpload: function (fileList, listName) {
            this.form[listName] = fileList;
            this[listName+'Src'] = '/exchangeApi/common/photo?name='+fileList[0];
        }
    }
}